<template>
	<div class="">
		<!--滚动内容 start-->
		<el-scrollbar class="app-container-scroll-bar">
			
			<listTpml 
				ref="listTpml"
				:data="pageData" 
				@onCommand="listCommand"
				></listTpml>
			
    </el-scrollbar>
    <!--滚动内容 end -->
		
		
		<!--弹窗内容 start-->
		<div class="app-output-window">
			
			<addJQZJDialog
				ref="addJQZJDialog"
				id=""
				@addSucess="refresh"
				></addJQZJDialog>
				
			<setZJJQDialog
				ref="setZJJQDialog"
				@addSucess="refresh"
				></setZJJQDialog>	
				
			<initZJDialog
				ref="initZJDialog"
				@addSucess="refresh"
				></initZJDialog>
				
		</div>
		<!--弹窗内容 end-->
		
	</div>
</template>

<script>
import { hostStatusFilter } from '@/filters/status/index';
import listTpml from "@/view/components/listTmpl";
import { apiUrls, getHostStatus, getVncHostUrl } from "@/service/swagger/ResourceHostController";
import { vncAuth } from "@/service/swagger/ResourceInitController.js";
import { deleteHost } from "@/service/swagger/ResourceClusterController";
import addJQZJDialog from "@/view/components/dialog/addJQZJDialog";
import setZJJQDialog from "@/view/components/dialog/setZJJQDialog";
import initZJDialog from "@/view/components/dialog/initZJDialog";
import { listenner } from "@/utils/statuslistener";

export default {
	components: {
		listTpml,
		addJQZJDialog,
		setZJJQDialog,
		initZJDialog,
	},
	data() {
		return {
			pageData: {
				pageTitle: "主机管理",
				filterOption: [
					{
						label: "所属集群", // label名
						paramsName: "clusterId", // 出参name值
						defaultValue: "", // 出参默认值
						componentsName: "jiqunSelect", // 组件名
					},
					// {
					// 	label: "名称", // label名
					// 	paramsName: "name", // 出参name值
					// 	defaultValue: "", // 出参默认值
					// 	componentsName: "hostNameInput", // 组件名
					// },
					{
						label: "状态", // label名
						paramsName: "status", // 出参name值
						defaultValue: this.$route.query.status || this.$route.query.status == 0 ? this.$route.query.status : "", // 出参默认值
						componentsName: "hostStatusSelect", // 组件名
					}
				],
				// 列表table 设置
				listOption: {

					// 列表上部btn组
					listBtns: [{
						label: "添加主机",
						iconfont: "icon-folder-add",
						commandName: "addZJ",
					},],
					// 列表api
					listApi: {
						url: apiUrls.getIpList,
						type: "POST"
					},
					// 表头设置
					header: [{
						label: "主机",
						propName: "ip",
						align: "left",
					}, {
						label: "节点类型",
						html: (row) => {
							return row.isManager == 1 ? "管理节点" : "工作节点";
						},
					}, {
						label: "状态",
						propName: "status",
						html: (row) => {
							return hostStatusFilter(row.status)
						}
					}, {
						label: "CPU",
						propName: "cpuUsedPercent",
					}, {
						label: "内存",
						html: (row) => {
							return row.memoryUsed + "/" + row.memoryTotal
						},
					}, {
						label: "硬盘",
						html: (row) => {
							return row.diskUsed + "/" + row.diskTotal
						},
					}, {
						label: "所属集群",
						propName: "clusterName",
					},
					// {
					// 	label: "描述信息",
					// 	propName: "message",
					// },
					{
						label: "操作",
						width: "200",
						btns: [{
							label: "详情",
							commandName: "goDetail",
							show: (row) => {
								return row.status !== 0;
							}
						}, {
							label: "初始化",
							commandName: "initZj",
							show: (row) => {
								return row.status == 0 || row.status == 3;
							}
						}, {
							label: "删除",
							commandName: "deleteZJ",
							show: (row) => {
								return row.status != 2;
							}
						}],
						btnGroups: [{
							label: "修改所属集群",
							commandName: "updateZJJQ",
							show: (row) => {
								// 正常 运行中 不可修改
								return row.status == 0 || row.status == 3;
							},
						}, {
							label: "远程连接",
							commandName: "RemoteConnection",
							show: (row) => {
								return row.status == 1
							}
						}]
					}]
				}
			},

		}
	},
	methods: {
		listCommand(command, row, index) {
			// console.log("列表进行了操作：", command,row,index );
			if (command && this[command]) {
				this[command](row, index);
			}
		},
		listLoaded(tableData) {

			console.log("页面列表 search 完成", tableData);

			const statusStatic = (status) => {
				// 是否是稳定状态
				const isStatic = !(hostStatusFilter(status).indexOf("...") > -1);
				return isStatic;
			}
			let unStaticArr = [];
			// 添加  status 监听
			tableData.forEach(el => {
				if (!statusStatic(el.status)) {
					unStaticArr.push(el.id)
				}
			});
			if (unStaticArr && unStaticArr.length) {
				listenner({
					api: {
						serviceFN: getHostStatus,
						params: unStaticArr,
					},
					callBack: (ret) => {

						let hasAllStatusStaticed = true;
						ret.data.forEach(data => {
							if (!statusStatic(data.status)) {
								hasAllStatusStaticed = false;
							}
							tableData.forEach(el => {
								if (data.id == el.id) {
									el.status = data.status;
									el.message = data.message
								}
							});
						});
						this.$refs.listTpml.loadTableData(tableData)
						return hasAllStatusStaticed;
					},
				}, this)
			}

		},

		addZJ(row, index) {
			this.$refs.addJQZJDialog.open();
		},
		goDetail(row, index) {
			this.$router.push({
				path: "zj/xq",
				query: {
					ip: row.ip,
					id: row.initId
				}
			})
		},
		deleteZJ(row, index) {
			this.$confirm(`您确认删除主机${row.ip}？`, "提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning"
			}).then(() => {
				deleteHost({
					ip: row.ip
				}).then(ret => {
					if (!ret.code) {
						this.$message({
							message: "删除成功",
							type: "success"
						});
						this.refresh();
					}
				});
			});

		},
		updateZJJQ(row, index) {
			this.$refs.setZJJQDialog.open(row);
		},


		initZj(row, index) {
			console.log(1111, row)
			this.$refs.initZJDialog.init({
				ip: row.ip,
			}).open()
		},

		refresh() {
			console.log(this.$refs)
			this.$refs.listTpml.refresh();
		},
		//VNC远程连接
		RemoteConnection(row) {
//       getVncHostUrl({ ip: row.ip }).then(ret => {
//           if (ret && ret.code == 0) {
//              window.open(ret.data)
//           }
//        })
			 //授权
			 vncAuth(row.ip).then(ret=>{
        if(ret&&ret.code == 0){
					let url = 'test.html' + '?' + 'vncToken' + '=' + ret.data
					window.open(url)
        }
      })
			// this.$router.push({
			// 	path:'zj/yc',
			// 	query:{
			// 		ip:row.ip
			// 	}
			// })
		}
	}
}
</script>

<style>
</style>